<template>
	<comRoot>
		<template #page>
			<video
				:src="`${commonConfigs.domainFrontFileLink}/files/avideo/super-jackpot.mp4`"
				:muted="false" style="display: none;"></video>
			
			<video
				v-if="isShowMaxAward"
				:style="{
					'position': 'fixed',
					'left': '0rpx',
					'top': '0rpx',
					'width': '100vw',
					'height': '100vh',
					'z-index': 12000,
				}"
				:src="`${commonConfigs.domainFrontFileLink}/files/avideo/super-jackpot.mp4`"
				autoplay
				:muted="false"
				:controls="false"
				id="dragoVideo" ></video>
			
			<view class="competition-detail-page relative font-hanserif-bold">
				<!-- 自定义导航栏 -->
				<comDetailNavigateBack :title="rewardData.gyms_name" />
				
				<image class="bg competition-detail-bg" :src="rewardData.scene_cover_image" mode=""></image>
				
				<view class="detail-content relative" :style="{
						height: 'calc(100vh - ' + commonNavHeight + ')',
					}">
					<view class="content-title absolute flex-all-center">
						<image class="bg"
							:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/detial-title-bg.png`"
							mode=""></image>
						<text class="relative" v-if="rewardData && rewardData.scene_name">第{{ numToTextList[rewardData.scene_sort] }}层：{{ rewardData.scene_name }}</text>
					</view>
					
					<view class="content-box-light absolute flex-all-center">
						<image
							class="absolute flex-all-center"
							style="width: 540rpx;height: 501rpx;z-index: 10;"
							:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/box-light.png`"
							mode=""></image>
						<image 
							class="absolute flex-all-center"
							style="width: 429rpx;height: 429rpx;z-index: 10;"
							:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/box-${rewardData.scene_sort}.png`"
							mode=""></image>
					</view>
					
					
					<view class="content-box absolute">
						<image class="content-box-bg bg" 
							:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/detail-content-bg.png`"
							mode="widthFix"></image>
						
						<view class="content-box-tip absolute">
							<!-- <view>
								<text style="color: #FF8B1D;">挑战成功、</text>
								<text style="color: #88B52E;">挑战失败、</text>
								<text style="color: #02A3E3;">回到原点</text>
								道具为简中宝可梦
								<text style="color: #FF9DDD;">随机平卡一张</text>
							</view> -->
							<view style="color: #FF8B1D;">【获得概率为初始参考概率，实际概率随着抽赏进度动态变化】</view>
						</view>

						<view class="content-reward absolute flex" :class="[isPlatformPC ? 'overflowViewPC' : '']"
							v-if="gymsInfo">
							<view class="content-reward-item" @click="openBoxMask">
								<view class="content-reward-box relative flex-all-center">
									<image class="bg"
										:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/item-reward-bg.png`"
										mode=""></image>
									
									<image class="reward-img relative"
										:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/box-item-bg.png`"
										mode="widthFix"></image>
										
									<image class="reward-tips absolute"
										:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/item-sence-box.png`"
										mode=""></image>
								</view>
								<view class="content-reward-title truncate">宝箱</view>
								<view class="content-reward-desc truncate">概率：{{ gymsInfo.reward_item_rate }}</view>
							</view>
							<view class="content-reward-item" v-for="(item, index) in gymsInfo.gyms_scene_change_item"
								:key="index" @click="gooShopDetailFun(item, index)">
								<view class="content-reward-box relative flex-all-center">
									<image class="bg"
										:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/item-reward-bg.png`"
										mode=""></image>
									
									<!-- gyms_scene_change 0无变化，1下一层，2上一层，3回到原点 -->
									<image class="reward-tips absolute"
										:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/item-sence-success-2.png`"
										v-if="item.gyms_scene_change === 1" mode=""></image>
									<image class="reward-tips absolute"
										:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/item-sence-fail-2.png`"
										v-else-if="item.gyms_scene_change === 2" mode=""></image>
									<image class="reward-tips absolute"
										:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/item-sence-origin-2.png`"
										v-else-if="item.gyms_scene_change === 3" mode=""></image>
										
									<image class="reward-img relative" :src="item.reward_item_cover" mode="heightFix"></image>
									
								</view>
								<view class="content-reward-title truncate">{{ item.reward_item_name }}</view>
								<view class="content-reward-desc truncate">概率：{{ item.reward_rate }}</view>
							</view>
						</view>
						<view class="reward-btns absolute"
							:class="[isPlatformPC ? 'overflowViewPC' : '', gymsInfo.reward_sheet_range && gymsInfo.reward_sheet_range.length < 3 ? 'justify-content-center' : '']"
							v-if="gymsInfo">
							<image class="bg"
								:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/detail-btns-bg.png`"
								mode="widthFix"></image>
							
							<view class="btn-item relative" v-for="(item, index) in gymsInfo.reward_sheet_range" :key="index"
								@click="item.reward_price_status === 'can' ? setPreOrderFun(item.reward_price_number) : ''">
								<view class="btn-item-box relative douyu flex-all-center">
									<image class="bg" 
										:src="
											index === gymsInfo.reward_sheet_range.length - 1
												? `${commonConfigs.domainFrontFileLink}/files/images/competition/submit-challenge-btn.png`
												: `${commonConfigs.domainFrontFileLink}/files/images/competition/goto-challenge-btn-other.png`
										" mode=""></image>
									
									<!-- <text class="relative"
										:class="[index === gymsInfo.reward_sheet_range.length - 1 ? 'btn-text2' : 'btn-text']">
										渡劫 {{ item.reward_price_number }} 次
									</text> -->
								</view>
								<view class="text">需支付￥{{ item.reward_price }}</view>
							</view>
						</view>
					</view>
				</view>
				
				<view class="side-box">
					<!-- 个人记录按钮 -->
					<image class="side-btn" 
						:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/record-icon.png`"
						mode="" @click="gooPageFun(`/secondary/competitionRecordPage/competitionRecordPage?gyms_id=${rewardPoolId}&fromlink=competitionSence`)"></image>
				
					<image class="side-btn" 
						:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/refresh-icon.png`"
						mode="" 
						@click="setReloadFun"></image>
				
					<image class="side-btn" 
						:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/bag-icon.png`"
						mode="" @click="gooPageUrl"></image>
				</view>
				
				<comRewardOrder
					ref="comRewardOrder"
					v-model="isShowOrderUppop" 
					:poolTypeSence="poolTypeSence" 
					:rewardData="rewardData" 
					:rewardBtnNum="rewardBtnNum"
					:isMaxRewardNum="isMaxRewardNum"
					:fromUseSence="'competitionSence'"
					@setPayOrderFun="setPayOrderFun" 
					@setNextOrderFun="setNextOrderFun"
					@setSelectCouponFun="setSelectCouponFun" 
					@setCurrentPaysFun="setCurrentPaysFun"
					@setAgreeFun="$store.commit('SHOW_AGREEMENT_SET_FUN', true)"></comRewardOrder>
				
				<!-- 抽赏弹框 -->
				<view :class="['relative', 'mask-show-hide']" :style="{
						zIndex: isShowRewardRes ? '12000' : isOnceMoreShowing ? '12000' : '-150000'
					}">
					<view :class="['relative']">
						<view class="reward-box relative">
							<image class="bg"
								:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/reward-res-bg.png`"
								mode=""></image>
							
							<view class="res-pool-list absolute flex-all-center" v-if="awardData && gyms_scene_change !== -1">
								<view class="res-pool-detail flex-all-center relative flex-direction-column" v-for="(subItem, subIndex) in awardData" :key="subIndex">
									
									<view :class="[subItem.gyms_scene_change === 0 ? 'content-pool-cover' : 'res-pool-cover', 'relative', 'flex-all-center']">
										<!-- gyms_scene_change 0无变化，1下一层，2上一层，3回到原点 -->
										<view class="bag-goods-type absolute" v-if="subItem.reward_item_type && subItem.gyms_scene_change === 0">
											<image class="bag-goods-type-img relative"
												:src="`${commonConfigs.domainFrontFileLink}/files/images/common/level/level-` + subItem.reward_item_type.toLowerCase() + '.png'"
												mode="heightFix"></image>
										</view>
										
										<image class="bg absolute" 
											v-if="commonConfigs && commonConfigs.domainFrontFileLink && subItem.gyms_scene_change === 0" 
											:src="`${commonConfigs.domainFrontFileLink}/files/images/common/level/small-border-${subItem.reward_item_type && subItem.reward_item_type.toLowerCase()}.png`" mode=""></image>
										<image v-else class="bg absolute"
											:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/competition-level-border.png`" mode=""></image>
										
										<image class="bg absolute-center"
											v-if="commonConfigs && commonConfigs.domainFrontFileLink && subItem.gyms_scene_change !== 0" 
											style="width: 254rpx;height: 339rpx;"
											:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/competition-award-box-bg.png`" mode=""></image>
											
										<image class="level-goods-type-img absolute"
											v-if="commonConfigs && commonConfigs.domainFrontFileLink && subItem.gyms_scene_change" 
											:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/new-competition-level-${subItem.gyms_scene_change}.png`"
											mode=""></image>
										
										<comPlaceImage
											class="pool-cover-img"
											placeImageClass="flex-all-center"
											:lazyLoad="true"
											:src="subItem.reward_item_cover"
											mode="heightFix"></comPlaceImage>
									</view>
									<view class="content-pool-txt relative truncate flex-all-center">
										<image class="bg"
											style="width: 371rpx;height: 47rpx;"
											v-if="commonConfigs && commonConfigs.domainFrontFileLink" 
											:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/competition-reward-txt-bg.png`" mode=""></image>
										<view class="relative">{{ subItem.reward_item_name }}</view>
									</view>
									<view class="content-item-price text-nowrap" v-if="subItem.gyms_scene_change === 0">
										价值：
										<text class="price">{{ subItem.recovery_price }}</text>
									</view>
								</view>
								
							</view>
							
							<view class="dialog-btn absolute flex-all-center" v-if="awardData && gyms_scene_change !== -1">
								<!-- 返回 -->
								<image class="btn" :src="`${commonConfigs.domainFrontFileLink}/files/images/competition/back-btn-bg.png`"
									mode="" @click="setBackFun"></image>
								<!-- 完成挑战：第9层，抽中任意物品（除上一层、返回原点的物品） -->
								<image class="btn" v-if="rewardData.scene_sort === 9 && gyms_scene_change === 0"
									:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/comple-btn-bg.png`" mode=""
									@click="setBackFun"></image>
								<!-- 下一层 -->
								<image class="btn" v-else-if="gyms_scene_change === 1"
									:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/succ-btn-bg.png`" mode=""
									@click="setCompleteFun"></image>
								<!-- 上一层 -->
								<image class="btn" v-else-if="gyms_scene_change === 2"
									:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/fail-btn-bg.png`" mode=""
									@click="setCompleteFun"></image>
								<!-- 回到原点 -->
								<image class="btn" v-else-if="gyms_scene_change === 3"
									:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/origin-btn-bg.png`" mode=""
									@click="setCompleteFun"></image>
								<!-- 再次挑战 -->
								<image class="btn" v-else
									:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/reward-btn-bg.png`" mode=""
									@click.stop="setOnceMoreFun"></image>
							</view>
							
						</view>
						
					</view>
				</view>
				
				<!-- 宝箱弹框 -->
				<view class="mask-view" v-if="boxMask" :zoom="true" @click="closeBoxMask">
					<view class="box-content absolute font-hanserif-bold" @click.stop="boxMask = true">
						<image class="bg" 
							:src="`${commonConfigs.domainFrontFileLink}/files/images/competition/reward-box-bg.png`"
							mode=""></image>
						<view class="box-content-list absolute flex">
							<view class="bag-goods-list flex-justify-content-between flex-wrap" v-if="gymsInfo.reward_item && gymsInfo.reward_item.length">
								<view class="content-pool-detail relative" v-for="(subItem, subIndex) in gymsInfo.reward_item" :key="subIndex" @click="gooShopDetailFun(subItem, subIndex)">
									<view class="bag-goods-type absolute" v-if="subItem.reward_item_type">
										<image class="bag-goods-type-img relative"
											:src="`${commonConfigs.domainFrontFileLink}/files/images/common/level/level-` + subItem.reward_item_type.toLowerCase() + '.png'"
											mode="heightFix"></image>
									</view>
									<view class="content-pool-cover relative flex-all-center">
										<image class="bg absolute" v-if="commonConfigs && commonConfigs.domainFrontFileLink" :src="`${commonConfigs.domainFrontFileLink}/files/images/common/level/small-border-${subItem.reward_item_type && subItem.reward_item_type.toLowerCase()}.png`" mode=""></image>
										<comPlaceImage
											class="pool-cover-img"
											placeImageClass="flex-all-center"
											:lazyLoad="true"
											:src="subItem.reward_item_cover"
											mode="heightFix"></comPlaceImage>
									</view>
									<view class="content-pool-txt" v-if="showNoticeTxtFun(subItem.reward_item_name, 8)" style="margin-top: 10rpx;">
										<uni-notice-bar
											class="uni-notice-bar"
											color="#23220C"
											background-color="transparent"
											:scrollable="true"
											:single="true"
											:text="showNoticeTxtFun(subItem.reward_item_name, 8)"
											:speed="54"
										></uni-notice-bar>
									</view>
									<view class="content-pool-txt truncate" v-else>{{ subItem.reward_item_name }}</view>
									<view class="content-item-price text-nowrap">
										抽价：
										<text class="price">{{ subItem.recovery_price }}</text>
									</view>
									<view class="content-item-rate text-nowrap">
										概率：
										<text class="rate">{{ subItem.reward_rate }}</text>
									</view>
								</view>
								<view class="content-pool-detail relative"></view>
							</view>
							
							<view v-else-if="gymsInfo.reward_item && !gymsInfo.reward_item.length && !previewLoading" style="z-index: 0">
								<comEmptyData></comEmptyData>
							</view>
							
							<comLoading style="width: 100%;height: 100%;" v-if="previewLoading"></comLoading>
						</view>

						<image class="box-close-box absolute"
							@click.stop="closeBoxMask"
							v-if="commonConfigs && commonConfigs.domainFrontFileLink" 
							:src="`${commonConfigs.domainFrontFileLink}/files/images/popup/popup-btn-img.png`" mode=""></image>
					</view>
				</view>
				
			</view>

		</template>
	</comRoot>
</template>

<script>
	import audio from '@/setupproject/AVIDEO_FUN.js';
	
	import otherpay from '@/inmixed/otherpay.mixin.js'

	import {
		payment
	} from '@/setupproject/PAYS_FUN';

	import {
		getPoolChallengeItemSpeedApi,
		getPoolChallengeInfoApi,
		getContentHomeApi,
		getRewardViewAgreementApi,

		geChallengeOrderPreApi,
		geChallengeOrderApi,
		geChallengeResApi,
		getChallengeCollectApi,
	} from '@/setupproject/INTERFACE';

	import {
		setAsyncFunWait,
		wxAuthSetFun,
		addPhoneSetFun,
	} from '@/setupproject/TOOLS_FUN';

	import store from '@/store';
	import {
		ACTIONS
	} from '@/store/modules/userStore';

	export default {
		name: 'competitionDetailPage',
		mixins: [otherpay],
		data() {
			return {
				isShowMaxAward: false, 
				numToTextList: ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九', '十'],
				poolTypeSence: 'competitionSence',
				rewardPoolId: '',
				reward_pool_gyms_id: '',
				rewardData: {},
				gymsInfo: {},
				isShowOrderUppop: false,
				submitLoading: false,
				currentIdCoupon: null,
				
				isShowRewardRes: false,
				isResponding: true,
				isOnceMoreShowing: false, // 是否再来一抽中ing
				scaleRewardLoading: false, // 等待响应
				awardData: [],
				rewardConfig: [], //奖励配置
				rewardBtnNum: 1,
				isMaxRewardNum: false,
				isPlatformPC: false, //PC端标识
				previewImageIndex: 0,
				boxMask: false, //宝箱弹框
				gyms_scene_change: -1, //抽中赏品的类型
				// 存储支付信息，onshow触发查询支付结果
				apiPayTypeVal: 5,
				currentPayType: 'wxpay',
				payBeInfos: {
					isPayBackSence: false,
					type: null,
					balance_order_num: null,
				},
				isFlag: false,
			};
		},
		computed: {
			boxSubIndex() {
				return store.getters.boxSubIndex;
			},
			commonOnline() {
				return store.getters.commonOnline;
			},
			commonNavHeight() {
				return store.getters.commonNavHeight + 'px';
			},
			commonConfigs() {
				return store.getters.commonConfigs || {};
			},
			commonPaySortList() {
				return store.getters.commonPaySortList;
			},
			previewImageUrls() {
				return (
					this.gymsInfo.gyms_scene_change_item &&
					this.gymsInfo.gyms_scene_change_item.map((item) => {
						return {
							image: item.reward_item_cover,
							text: item.reward_item_name,
							recovery_price: item.recovery_price,
							id: item.reward_item_id,
							type: item.reward_item_box_type
						};
					})
				);
			}
		},
		async onLoad({
			id
		}) {
			this.rewardPoolId = id;
			
			uni.getSystemInfo({
				success: (res) => {
					console.log('getSystemInfo,', res.platform);
					// windows | mac为pc端
					// android | ios为手机端
					if (['windows', 'mac'].indexOf(res.platform) !== -1) {
						this.isPlatformPC = true;
					} else {
						this.isPlatformPC = false;
					}
				}
			});
			
			// 获取手机号避免抽赏时出现手机号授权弹框
			await store.dispatch(ACTIONS.USER_INFO_GET_FUN);
			
			this.getRewardInfoFun();
		},
		onShow() {
			// #ifdef APP-PLUS
			if(this.$store.getters.detailRechargeFlag) {
				uni.$emit('update', 'comRewardOrder');
				
				// 详情页充值标志位
				this.$store.commit('SET_DETAIL_RECHARGE_FLAG', false);
				return;
			}
			// #endif
			
			// 监听返回当前平台时触发支付结果事件
			if(this.payBeInfos.isPayBackSence && ['adapay_mini', 'alipay', 'yeepay_wx', 'adapay_alipay', 'mbpay_jump_mini'].includes(this.currentPayType)){
				this.payBeInfos.isPayBackSence = !this.payBeInfos.isPayBackSence;
				this.$store.commit('SET_WATCH_PLAT_PARAMS', {
					'type': this.payBeInfos.type,
					'balance_order_num': this.payBeInfos.balance_order_num,
					'msg': '已购买成功，请去赏袋查看',
					'isReward': true
				});
			}
		},
		
		onShareAppMessage(e) {
			if (e.from === 'menu') {
				this.$store.commit('SHARE_INFO_SET_FUN', {
					title: this.rewardData.reward_pool_name,
					// path: `/secondary/competitionDetailPage/competitionDetailPage?id=${this.rewardPoolId}&boxSubIndex=${this.boxSubIndex}`,
					path: `/secondary/competitionPage/competitionPage?id=${this.rewardPoolId}`,
					imageUrl: this.rewardData.reward_pool_cover,
					content: '',
					desc: ''
				});
			}
			uni.showLoading({
				title: '',
				mask: false
			});
			const promise = new Promise((resolve) => {
				setTimeout(() => {
					const {
						shareObjData
					} = this.$store.getters;
					resolve(shareObjData)
					uni.hideLoading();
				}, 200);
			});
		
			return {
				promise
			};
		},
		
		methods: {
			gooShopDetailFun(item, index) {
				item.reward_price_1 = this.rewardData.reward_price_1;
				this.$store.commit('INFINITE_DETAILS_SET_FUN', item);
				
				uni.navigateTo({
					url: '/secondary/goodDetailPage/goodDetailPage?type=infinite'
				});
			},
			
			showNoticeTxtFun(name, len) {
				if (name) {
					var namelen = name.length, sum = 0; 
					for (var i = 0; i < namelen; i++) {
						// 中文: 字符编码大于255
						if (name.charCodeAt(i) > 255) {  
							sum += 2;  // 双字节, 累加2
						} else {
							sum++;  // 单字节, 累加1
						}
					}
					if (sum > len*2) {
						return name;
					}
				}
			},

			gooPageFun(url) {
				if (!url) return;

				uni.navigateTo({
					url: url
				});
			},
			share() {
				this.$store.commit('SHARE_INFO_SET_FUN', {	
					title: this.rewardData.reward_pool_name,
					path: `/secondary/competitionDetailPage/competitionDetailPage?id=${this.rewardPoolId}&boxSubIndex=${this.boxSubIndex}`,
					imageUrl: this.rewardData.reward_pool_cover,
					content: '',
					desc: ''
				});
			},
			openBoxMask() {
				this.boxMask = true;
			},
			closeBoxMask() {
				this.boxMask = false;
			},
			gooPageUrl() {
				uni.navigateTo({
					url: '/secondary/bagPage/bagPage'
				});
			},
			async getRewardInfoFun() {
				const {
					data,
					code,
					msg
				} = await getPoolChallengeInfoApi({
					gyms_id: this.rewardPoolId
				});

				if (code !== 200) {
					return uni.showToast({
						icon: 'none',
						title: msg
					});
				}
				this.rewardData = data;
				this.rewardData.reward_pool_name = data.gyms_name;
				this.rewardData.reward_pool_cover = data.gyms_cover_image;
				this.reward_pool_gyms_id = data.reward_pool_gyms_id;
				this.getPoolChallengeItemSpeedApi();
			},
			async getPoolChallengeItemSpeedApi() {
				const {
					data,
					code,
					msg
				} = await getPoolChallengeItemSpeedApi({
					gyms_id: this.rewardPoolId,
					reward_pool_gyms_id: this.reward_pool_gyms_id
				});

				if (code !== 200) {
					return uni.showToast({
						icon: 'none',
						title: msg
					});
				}

				this.gymsInfo = data;
			},
			setSelectCouponFun(value) {
				this.currentIdCoupon = value;
				this.setNextOrderFun();
			},
			// 获取pay-type组件的选择值
			setCurrentPaysFun(value) {
				this.currentPayType = value;
			},
			orderInfoDats() {
				return {
					is_use_infinite_schedule_double_num: store.getters.commonPaySortList.includes(4) ? 1 : 0,
					use_currency_num: store.getters.commonPaySortList.includes(1) ? 1 : 0,
					use_balance: store.getters.commonPaySortList.includes(2) ? 1 : 0,
					coupon_id: store.getters.commonPaySortList.includes(3) ? this.currentIdCoupon : '',
					pay_channel: this.currentPayType,
					reward_pool_id: this.rewardPoolId,
					gyms_id: this.rewardPoolId,
					reward_cur_box_num: 1,
					reward_num: this.rewardBtnNum,
				};
			},
			// 下一层、上一层、回到原点
			async setCompleteFun() {
				this.isShowRewardRes = false;
				await this.setReloadFun();
			},
			// 返回阶梯
			setBackFun() {
				this.isShowRewardRes = false;
				uni.navigateBack({
					delta: 1 // 返回的页面数
				});
			},
			async setOnceMoreFun() {
				if(this.isFlag) return;
				this.isFlag = true;
				
				// 再次一次取消双倍球使用
				if(this.commonPaySortList.includes(4)) {
					// return this.isShowBallPrompt = true;
					const index = this.commonPaySortList.indexOf(4);
					this.commonPaySortList.splice(index, 1);
					await store.commit('CHECK_LIST_SET_FUN', this.commonPaySortList);
				}
				
				if(!this.isResponding && this.submitLoading) return;
				await (this.isOnceMoreShowing = true); // isOnceMoreShowing
				
				await (this.rerwardAnimateClass = 'rerward-animate-shake');
				await (this.scaleRewardLoading = true);
				
				// this.isShowRewardRes = false;.
				await this.setPayOrderFun();
				
				await setAsyncFunWait(500);
				await (this.isOnceMoreShowing = false);
				await (this.isMoreSureBall = false);
				await (this.isOnceMoreShowing = false); // 是否再来一抽正在请求中
				
				this.isFlag = false;
			},
			
			async setPreOrderFun(num) {
				if (this.submitLoading) return;
				
				// #ifdef MP-WEIXIN
				// 支付前验证是否已登录
				if (!wxAuthSetFun()) return;
				// #endif
			
				// #ifdef APP-PLUS
				// 支付前验证是否已登录
				if (await store.dispatch('SHOW_LOGIN_APP_GET_FUN')) return;
				// 支付前验证是否已绑定手机
				if (addPhoneSetFun()) return;
				// #endif
				
				this.getPayNotice();
			
				this.currentIdCoupon = '';
				this.rewardBtnNum = num;
				
				let rangelen = this.rewardData.reward_sheet_range.length;
				this.isMaxRewardNum = (num == this.rewardData.reward_sheet_range[rangelen - 1].reward_price_number);
				
				this.$set(this.rewardData, 'cover', this.rewardData.reward_pool_cover);
				this.$set(this.rewardData, 'reward_num', this.rewardBtnNum);
				this.$set(this.rewardData, 'num', this.rewardBtnNum);
				this.$set(this.rewardData, 'name', this.rewardData.reward_pool_name);
				
				this.setNextOrderFun();
			},

			async setNextOrderFun() {
				if(this.poolTypeSence === 'integral') {
					const { data, code } = await getRewardOrderPointPreApi(this.orderInfoDats());
					
					if (code !== 200) return false;
					
					if (!data) return;
					
					this.$set(this.rewardData, 'currency_num', data.currency_num);
					this.$set(this.rewardData, 'is_view_pay_agreement', data.is_view_pay_agreement);
					this.$set(this.rewardData, 'deduct_balance_rmb', data.deduct_balance_rmb || 0);
					this.$set(this.rewardData, 'infinite_schedule_double_num', data.infinite_schedule_double_num || 0);
					this.$set(this.rewardData, 'deduct_currency_num_rmb', data.deduct_currency_num_rmb || 0);
					this.$set(this.rewardData, 'allPrice', data.reward_price_final);
					this.$set(this.rewardData, 'price', data.reward_price);
					this.$set(this.rewardData, 'beforePrice', data.reward_price_before_coupon);
					this.$set(this.rewardData, 'couponResult', data.coupon_resutl);
					this.$set(this.rewardData, 'points', data.points);
				}else{
					const { data, code } = await geChallengeOrderPreApi(this.orderInfoDats());
					
					if (code !== 200) return false;
					
					if (!data) return;
					
					this.$set(this.rewardData, 'currency_num', data.currency_num);
					this.$set(this.rewardData, 'is_view_pay_agreement', data.is_view_pay_agreement);
					this.$set(this.rewardData, 'deduct_balance_rmb', data.deduct_balance_rmb || 0);
					this.$set(this.rewardData, 'infinite_schedule_double_num', data.infinite_schedule_double_num || 0);
					this.$set(this.rewardData, 'deduct_currency_num_rmb', data.deduct_currency_num_rmb || 0);
					this.$set(this.rewardData, 'allPrice', data.reward_price_final);
					this.$set(this.rewardData, 'price', data.reward_price);
					this.$set(this.rewardData, 'beforePrice', data.reward_price_before_coupon);
					this.$set(this.rewardData, 'couponResult', data.coupon_resutl);
					this.$set(this.rewardData, 'balance', data.balance);
				}
				
				// 没有双倍球的情况下，去掉该默认选项
				if(!this.rewardData.infinite_schedule_double_num && this.commonPaySortList.includes(4)) {
					const index = this.commonPaySortList.indexOf(4);
					this.commonPaySortList.splice(index, 1);
					await store.commit('CHECK_LIST_SET_FUN', this.commonPaySortList);
				}
				
				this.isShowOrderUppop = true;
			},
			
			async setPayOrderFun() {
				if (this.submitLoading) return;
				this.submitLoading = true;
			
				if(this.poolTypeSence === 'integral') {
					const { data: productInfos, code, msg } = await getRewardOrderPointApi(this.orderInfoDats());
					this.currentIdCoupon = '';
					if (code !== 200) {
						this.submitLoading = false;
						return uni.showToast({
							icon: 'none',
							title: msg
						});
					}
					
					try {
						if (!productInfos.is_need_wx_pay) {
							await this.getRewardResFun(productInfos.order_num);
							return (this.submitLoading = false);
						}
						await payment(productInfos, this.currentPayType || 'wxpay', this.apiPayTypeVal);
						await this.getRewardResFun(productInfos.order_num);
					} catch (e) {
						this.submitLoading = false;
						console.error(e);
					}
					this.submitLoading = false;
					return;
				}
			
				const {
					data: productInfos,
					code,
					msg
				} = await geChallengeOrderApi(this.orderInfoDats());
				
				this.currentIdCoupon = '';
				
				if (code !== 200) {
					this.submitLoading = false;
					return uni.showToast({
						icon: 'none',
						title: msg
					});
				}
			
				// 原生支付： 微信、小程序、支付宝
				if (['wxapp', 'wxpay', 'alipay_method', 'mbpay_wxmini'].indexOf(this.currentPayType) !== -1) {
					try {
						if (!productInfos.is_need_wx_pay) {
							await this.getRewardResFun(productInfos.order_num);
							return (this.submitLoading = false);
						}
						await payment(productInfos, this.currentPayType || 'wxpay', this.apiPayTypeVal);
						await this.getRewardResFun(productInfos.order_num);
					} catch (e) {
						this.submitLoading = false;
						console.error(e);
					}
					this.submitLoading = false;
					return;
				}
				
				// 第三方小程序微信
				if (['adapay_mini', 'yeepay_wx', 'adapay_alipay', 'lianlianpay', 'mbpay_jump_mini'].includes(this.currentPayType)) {
					try {
						if (!productInfos.is_need_wx_pay) {
							await this.getRewardResFun(productInfos.order_num, msg);
							return this.submitLoading = false;
						}
						productInfos.balance_order_num = productInfos.order_num;
						return this.launchMPToPayFun(productInfos, this.currentPayType);
					} catch (e) {
						this.submitLoading = false;
						console.error(e);
					}
					return;
				}
			
			},
			
			async getRewardResFun(order_num) {
				this.isResponding = false;
				const {
					data,
					msg,
					code
				} = await geChallengeResApi({
					order_num
				});
			
				if (code !== 200) {
					this.submitLoading = false;
					return uni.showToast({
						icon: 'none',
						title: msg,
						duration: 2000
					});
				}
				
				// this.isOnceMoreShowing = false;
				await (this.rerwardAnimateClass = 'rerward-animate-before');
				await setAsyncFunWait(200);
			
				this.awardData = [];
				this.isShowOrderUppop = false;
				
				// this.getRewardInfoFun();
			
				await setAsyncFunWait(20);
			
				this.isShowFinalRes = true;
				
				// animation_switch 特效开关 + is_special 大赏开关
				if(!uni.getStorageSync('isRewardAniamteSwitch')) {
					if(data.animation_switch && data.is_special) {
						this.isShowMaxAward = true;
						
						uni.vibrateLong({
							success: function () {
								console.log('success');
							}
						});
					}else{
						this.isShowMaxAward = false;
					}
				}
				
				// 特效 + 大赏 = 龙
				if(this.isShowMaxAward) {
					await (this.scaleRewardLoading = false);
					await (this.rerwardAnimateClass = 'rerward-animate-after');
					
					this.isShowRewardRes = false;
					await setAsyncFunWait(7000);
					
					for (let item of data.sort_detail) {
						this.awardData.push(item)
					}
					
					this.isShowRewardRes = true;
					this.scheduleDoubleNum = data.schedule_double_num;
					this.isShowBallMask = (data.schedule_double_num ? true : false);
					this.$forceUpdate();
					await setAsyncFunWait(1500);
					this.isShowMaxAward = false;
				}else{
					if(!uni.getStorageSync('isRewardAudioSwitch')) {
						audio.setPlayAVideo(`${this.commonConfigs.domainFrontFileLink}/files/avideo/open-box-audio.mp3`); // 中奖声音
					}
					
					await (this.scaleRewardLoading = false);
					await (this.rerwardAnimateClass = 'rerward-animate-after');
					
					for (let item of data.sort_detail) {
						this.awardData.push(item)
					}
					
					this.isShowRewardRes = true;
					this.scheduleDoubleNum = data.schedule_double_num;
					this.isShowBallMask = (data.schedule_double_num ? true : false);
					this.$forceUpdate();
				}
				
				
				await (this.gyms_scene_change = -1);
				
				await setAsyncFunWait(10);
				
				if (this.awardData.length) this.gyms_scene_change = this.awardData[this.awardData.length - 1]
					.gyms_scene_change;
				
				this.submitLoading = false;
				this.isResponding = true;
				
				await (this.rerwardAnimateClass = '');
			},
			
			async setChallengeCollectFun(is_collect) {
				const {
					data,
					code,
					msg
				} = await getChallengeCollectApi({
					gyms_id: this.rewardPoolId,
					collect_type: is_collect === 1 ? 2 : 1 //类型: 1收藏, 2取消收藏
				});

				if (code !== 200) {
					return uni.showToast({
						icon: 'none',
						title: msg
					});
				}

				uni.showToast({
					icon: 'success',
					title: msg
				});
				this.rewardData.is_collect = is_collect === 1 ? 0 : 1;
			},
			async setReloadFun() {
				await store.commit('SHOW_LOADING_SET_FUN', true);
				this.rewardData = {};
				
				await this.getRewardInfoFun();
				
				await setAsyncFunWait(1000);
				await store.commit('SHOW_LOADING_SET_FUN', false);
			}
		}
	};
</script>

<style lang="scss" scoped>
	.competition-detail-page {
		width: 100%;
		height: 100vh;
		
		.competition-detail-bg {
			width: 100%;
			height: 1624rpx;
		}

		.detail-content {
			padding-top: 30rpx;

			.content-title {
				left: 0;
				right: 0;
				top: 10rpx;
				margin: auto;
				width: 349rpx;
				height: 64rpx;
				font-weight: bold;
				font-size: 32rpx;
				color: #fff;
				text-shadow: 0px 3px 5px rgba(0, 0, 0, 0.35);
			}
			
			.content-box-light {
				left: 0;
				right: 0;
				top: 280rpx;
				margin: auto;
				width: 540rpx;
				height: 501rpx;
			}

			.content-box {
				z-index: 1;
				left: 0;
				bottom: 0;
				width: 100%;
				height: 631rpx;

				.content-box-bg {
					left: 0;
					bottom: 0;
					width: 100%;
				}

				.content-box-tip {
					top: 100rpx;
					left: 20rpx;
					font-size: 20rpx;
					color: #ddd;
				}

				.content-reward {
					left: 0;
					right: 0;
					top: 136rpx;
					margin: auto;
					width: 100%;
					overflow-x: auto;
					padding: 0 10rpx;

					.content-reward-item {
						margin-right: 6rpx;

						&:last-child {
							margin-right: 0;
						}

						width: 158rpx;

						.content-reward-box {
							width: 158rpx;
							height: 212rpx;
							text-align: center;

							.reward-img {
								width: 120rpx;
								max-height: 167rpx;
							}

							.reward-tips {
								left: 8rpx;
								bottom: 8rpx;
								width: 140rpx;
								height: 118rpx;
								z-index: 10;
							}
						}

						.content-reward-title {
							height: 28rpx;
							line-height: 28rpx;
							font-size: 28rpx;
							color: #111111;
							margin: 6rpx 0;
							text-align: center;
						}

						.content-reward-desc {
							font-size: 18rpx;
							color: #FF8B1D;
							text-align: center;
						}
					}
				}

				.reward-btns {
					left: 0;
					right: 0;
					bottom: 0rpx;
					margin: auto;
					width: 100%;
					height: 238rpx;
					overflow-x: auto;

					.btn-item {
						width: 317rpx;
						height: 81rpx;
						text-align: center;
						left: 0;
						right: 0;
						top: 60rpx;
						margin: auto;

						.btn-item-box {
							width: 317rpx;
							height: 81rpx;
							font-size: 28rpx;

							.btn-text {
								color: #ffffff;
								background: linear-gradient(-65deg, #f9c3e8 0.5126953125%, #b1b8ef 37.0361328125%, #b7e4f0 66.064453125%, #abb9ed 100%);
								-webkit-background-clip: text;
								-webkit-text-fill-color: transparent;
							}

							.btn-text2 {
								color: #ffffff;
								background: linear-gradient(0deg, #f9e26c 0.68359375%, #f5e3ba 100%);
								-webkit-background-clip: text;
								-webkit-text-fill-color: transparent;
							}
						}

						.text {
							margin-top: 12rpx;
							white-space: nowrap;
							font-size: 28rpx;
							color: #FF8B1D;
						}
					}

					.btn-item+.btn-item {
						margin-left: 42rpx;
					}
				}
			}
		}
	}

	// 侧边栏按钮
	.side-box {
		position: fixed;
		top: 600rpx;
		right: 30rpx;
		z-index: 1000;

		.side-btn {
			width: 80rpx;
			height: 93rpx;
			margin-bottom: 60rpx;
		}
	}

	// 弹框蒙版
	.mask-view {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9999;
		width: 100%;
		height: 100vh;
		background: rgba(0, 0, 0, 0.8);
		overflow: hidden;
		color: #fff;
		
		.box-content {
			left: 0;
			right: 0;
			top: 0;
			bottom: 0;
			margin: auto;
			width: 670rpx;
			height: 831rpx;
			padding: 0 25rpx;
		
			.box-content-list {
				left: 0;
				right: 0;
				top: 100rpx;
				margin: auto;
				width: 100%;
				height: 710rpx;
				overflow-y: auto;
				flex-wrap: wrap;
				align-content: flex-start;
				
				.bag-goods-list {
					padding: 12rpx 18rpx;
					color: #FFF;
				}
					
				.content-pool-detail {
					width: 160rpx;
					margin-right: 10rpx;
					margin-bottom: 22rpx;
					
					.bag-goods-type {
						top: 6rpx;
						left: 6rpx;
						
						.bag-goods-type-img {
							height: 34rpx;
							z-index: 98;
						}
					}
					
					.content-pool-cover {
						width: 160rpx;
						height: 177rpx;
						
						.pool-cover-img {
							width: 126rpx;
							height: 130rpx;
							overflow: hidden;
						}
					}
					
					.content-pool-txt {
						width: 100%;
						height: 26rpx;
						line-height: 26rpx;
						color: #111111;
						font-size: 26rpx;
						text-align: center;
						margin-top: 6rpx;
					}
					
					.content-item-price {
						margin-top: 4rpx;
						font-size: 24rpx;
						color: #88875A;
						text-align: center;
					}
					
					.content-item-rate {
						margin-top: 4rpx;
						font-size: 24rpx;
						color: #FF8B1D;
						text-align: center;
					}
						
				}
				
			}
		
			.box-close-box {
				width: 290rpx;
				height: 82rpx;
				left: 0;
				right: 0;
				bottom: -100rpx;
				margin: auto;
				
			}
		}
		
	}

	.reward-box {
		width: 670rpx;
		height: 782rpx;
	}
	
	.res-pool-list {
		left: 0;
		right: 0;
		top: 180rpx;
		margin: auto;
		width: 100%;
		z-index: 0;
		
		.res-pool-detail {
			
			.bag-goods-type {
				top: 6rpx;
				left: 6rpx;
				
				.bag-goods-type-img {
					max-width: 100rpx;
					height: 34rpx;
					z-index: 98;
				}
			}
			
			.content-pool-cover {
				width: 240rpx;
				height: 265rpx;
				
				.pool-cover-img {
					width: 178rpx;
					height: 180rpx;
					overflow: hidden;
					top: 20rpx;
				}
			}
			
			.res-pool-cover {
				width: 358rpx;
				height: 404rpx;
				
				.level-goods-type-img {
					width: 224rpx;
					height: 190rpx;
					bottom: 40rpx;
					left: 68rpx;
					z-index: 10;
				}
				
				.pool-cover-img {
					width: 192rpx;
					height: 268rpx;
					overflow: hidden;
				}
			}
			
			.content-pool-txt {
				width: 370rpx;
				height: 47rpx;
				color: #FFF;
				font-size: 28rpx;
				text-align: center;
				margin-top: 26rpx;
				margin-bottom: 16rpx;
			}
			
			.content-item-price {
				margin-top: 4rpx;
				font-size: 24rpx;
				color: #D56E28;
				text-align: center;
			}
				
		}
		
	}

	.reward-list-more {
		left: 0;
		right: 0;
		top: 190rpx;
		margin: auto;
		width: 620rpx;
		height: 680rpx;
		z-index: 0;
		flex-wrap: wrap;
		justify-content: space-around;
		overflow: auto;

		.goods-item {
			width: 160rpx;
			margin-bottom: 20rpx;

			.goods-item-img {
				width: 160rpx;
				height: 230rpx;

				.cover {
					width: 140rpx;
					max-height: 210rpx;
					border-radius: 18rpx;
				}
			}

			.goods-item-text {
				margin-top: 20rpx;
				width: 100%;
				height: 30rpx;
				line-height: 30rpx;
				text-align: center;
				font-size: 20rpx;
				color: #fff;
			}
		}
	}

	// 按钮
	.dialog-btn {
		width: 100%;
		bottom: -100rpx;

		.btn {
			width: 213rpx;
			height: 60rpx;
		}

		.btn+.btn {
			margin-left: 50rpx;
		}
	}

	.mask-show-hide {
		position: fixed;
		background-color: rgba(0, 0, 0, 0.8);
		z-index: 1000;
		left: 0;
		top: 0;
		height: 100vh;
		width: 100vw;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>